<!-- 编辑 editProuduct-->
<template>
  <div class="content">
    <div class="product-edit">
      <div style="height: 20px; width: 100%;"></div>
      <el-form :model="data" ref="editProductForm" label-width="100px" size="medium" :rules="rules" v-loading="loading">
        <Tabs v-model="tabsActive">
          <TabsPane label="基本信息" :name="'1'">
            <el-row class="edit-form-item">
              <div class="form-content">
                <el-form-item label="商品名称：" prop="name">
                  <el-input type="textarea" v-model="data.name" :placeholder="'请输入商品名称(不超过'+ 30  +'字)'" :maxlength="30"
                            show-word-limit :autosize="{ minRows: 2, maxRows: 6 }"></el-input>
                </el-form-item>
                <el-form-item label="商品别名：" prop="detailTitle">
                  <el-input type="textarea" v-model="data.detailTitle" :placeholder="'请输入商品别名(不超过' + nameMaxLength + '字)'"
                            :maxlength="nameMaxLength" show-word-limit :autosize="{ minRows: 2, maxRows: 6 }"></el-input>
                  <span style="color:#c0c4cc"> &nbsp; 供应商使用(供货商商品名称)</span>
                </el-form-item>
                <el-form-item label="商品卖点：" prop="subTitle">
                  <el-input type="textarea" v-model="data.subTitle" :placeholder="'请输入商品卖点(不超过'+ '60'  +'字)'"
                            :maxlength="60" show-word-limit :autosize="{ minRows: 2, maxRows: 6 }"></el-input>
                  <span style="color:#c0c4cc"> &nbsp; 在商品详情页标题下面展示卖点信息 <span class="click-ele" @click="hanldeOpenExample">查看示例</span></span>
                </el-form-item>
                <el-form-item label="品牌名称：" prop="brandName">
                  <BrandName returnIdName="idname" v-model="data.brandId" style="width:240px;" placeholder="请输入选择品牌名称"
                             @getBrandName="getBrandName"></BrandName>
                </el-form-item>
                <el-form-item label="商品分类：" prop="productCategoryIds">
                  <el-cascader clearable v-model="data.productCategoryIds" :props="{ value: 'id', label: 'name' }"
                               :options="classList" placeholder="请选择商品分类"></el-cascader>
                </el-form-item>
                <el-form-item label="商品分组：" prop="groupIds">
                  <el-select clearable v-model="data.groupIds" placeholder="请选择商品分组" multiple>
                    <el-option v-for="item in groupList" :key="item.value" :label="item.label" :value="item.value"
                               :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="序号：" prop="sort">
                  <el-input-number v-model="data.sort" controls-position="right" :min="0"></el-input-number>
                  <span style="color:#c0c4cc"> &nbsp; 影响列表排序。若非特殊商品，建议设默认值0。</span>
                </el-form-item>
                <el-form-item label="商品封面：" prop="pic">
                  <Upload :limit="1" :limitSize="{width: 340, height: 340}" v-model="data.pic" :fileLists="data.picList"></Upload>
                  <span style="color:#c0c4cc">商品封面图片尺寸小于340x340像素</span>
                </el-form-item>
                <el-form-item label="商品轮播：" prop="albumPics">
                  <Upload v-model="data.albumPics" :limitSize="{width: 750, height: 500}" :fileLists="data.albumPicsList"></Upload>
                  <span style="color:#c0c4cc">商品轮播图片尺寸小于750x500像素</span>
                </el-form-item>
                <el-form-item label="商品详情图：" prop="detailDesc">
                  <Upload v-model="data.detailDesc" :limitSize="{width: 750}" :fileLists="data.detailDescList"></Upload>
                  <span style="color:#c0c4cc">商品详情图片尺寸宽小于750像素高随意</span>
                </el-form-item>
                <el-form-item label-width="0px" style="text-align: center;">
                  <Cbutton size="medium" @click="handleStep(1)">下一步，填写价格库存</Cbutton>
                </el-form-item>
              </div>
            </el-row>
          </TabsPane>
          <TabsPane label="价格库存" :name="'2'">
            <el-row class="edit-form-item">
              <div class="form-content">
                <el-form-item label="商品类型：">
                  <el-button-group>
                    <el-button @click="handleChangeProductType(1)" :type="data.productStyle === 1 ? 'primary' : ''">单规格</el-button>
                    <el-button @click="handleChangeProductType(2)" :type="data.productStyle === 2 ? 'primary' : ''">多规格</el-button>
                  </el-button-group>
                </el-form-item>
                <!-- 单规格 -->
                <el-row v-if="data.productStyle === 1">
                  <el-form-item label="规格名：" prop="specificationsTypes">
                    <el-input v-model="data.specificationsTypes" :placeholder="'请输入规格名(不超过'+ '20'  +'字)'" :maxlength="20"
                              show-word-limit :autosize="{ minRows: 2, maxRows: 6 }"></el-input>
                  </el-form-item>
                  <el-col :span="24" class="product-price-reg">
                    <el-form-item label="商品价格：" prop="">
                      <el-radio-group v-model="data.priceType" size="mini" @change="priceTypeChange">

                        <div :class="['product-price-radio', {'is-radio-error': priceError.usePointLimit.isError || priceError.price.isError}]">
                          <el-radio label="1">
                            <span>积分+现金&nbsp;</span>
                            <span>
                              消耗积分&nbsp;
                              <el-input v-model="data.usePointLimit" @change="(val) => handlePriceReg(val, 'usePointLimit')"
                                        :disabled="data.priceType !== '1'"></el-input>
                              &nbsp;现金&nbsp;
                              <el-input v-model="data.price" @change="(val) => handlePriceReg(val, 'price')" :disabled="data.priceType !== '1'"></el-input>
                            </span>
                            <span class="is-error-msg">积分、现金格式错误!</span>
                          </el-radio>
                        </div>
                        <div :class="['product-price-radio',{'is-radio-error': priceError.usePointLimitSingle.isError}]">
                          <el-radio label="2">
                            <span>积分&nbsp;</span>
                            <span>
                              消耗积分&nbsp;
                              <el-input v-model="data.usePointLimitSingle" @change="(val) => handlePriceReg(val, 'usePointLimitSingle')"
                                        :disabled="data.priceType !== '2'"></el-input>
                            </span>
                            <span class="is-error-msg">积分格式错误!</span>
                          </el-radio>
                        </div>
                        <div :class="['product-price-radio',{'is-radio-error': priceError.priceSingle.isError}]">
                          <el-radio label="3">
                            <span>现金&nbsp;&nbsp;</span>
                            <span>
                              <el-input v-model="data.priceSingle" @change="(val) => handlePriceReg(val, 'priceSingle')"
                                        :disabled="data.priceType !== '3'"></el-input>
                            </span>
                            <span class="is-error-msg">现金格式错误!</span>
                          </el-radio>
                        </div>
                      </el-radio-group>
                    </el-form-item>
                  </el-col>
                  <!-- <el-col :span="24">
                    <el-form-item label="积分兑换：" prop="usePointLimit">
                      <el-input v-model="data.usePointLimit" placeholder="请输入积分兑换"></el-input>
                    </el-form-item>
                  </el-col> -->
                  <el-col :span="24">
                    <el-form-item label="划线价：" prop="linePrice">
                      <el-input v-model="data.linePrice" placeholder="请输入划线价"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="商品库存：" prop="stock">
                      <el-input-number v-model="data.stock" placeholder="请输入库存" controls-position="right" :min="0"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="24">
                    <el-form-item label="成本价：" prop="costPrice">
                      <el-input v-model="data.costPrice" placeholder="请输入成本价"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <!-- 单规格 -->

                <!-- 多规格 -->
                <el-row :span="24" v-if="data.productStyle === 2">
                  <el-form-item label="商品价格：">
                    <el-radio-group v-model="data.priceType2" size="mini">
                      <el-radio label="1"> <span>积分+现金&nbsp;</span></el-radio>
                      <el-radio label="2"> <span>积分&nbsp;</span></el-radio>
                      <el-radio label="3"> <span>现金&nbsp;</span></el-radio>
                    </el-radio-group>
                    <Sku @upEmitData="handleGetSkuData" :priceType="data.priceType2" :data="skuData"></Sku>
                  </el-form-item>
                </el-row>
                <!-- 多规格 -->

                <el-form-item label="减库存方式：" prop="delStockStyle">
                  <el-radio-group v-model="data.delStockStyle">
                    <el-radio :label="1">付款减库存</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="推荐商品：" prop="recommandStatus">
                  <el-radio-group v-model="data.recommandStatus">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <!-- <el-form-item label="详情显示销量：" prop="showSales">
                  <el-radio-group v-model="data.showSales">
                    <el-radio :label="1">是</el-radio>
                    <el-radio :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item> -->
                <el-form-item label="商品编码：" prop="productSn">
                  <el-input v-model="data.productSn"></el-input>
                </el-form-item>

                <el-form-item label-width="0px" style="text-align: center;">
                  <Cbutton size="medium" @click="handleStep(-1)">上一步</Cbutton>
                  <Cbutton size="medium" @click="handleStep(1)">下一步，填写物流信息</Cbutton>
                </el-form-item>
              </div>
            </el-row>
          </TabsPane>
          <TabsPane label="物流信息" :name="'3'">
            <el-row class="edit-form-item">
              <div class="form-content">
                <el-form-item label="快递运费：" prop="expressFreight">
                  <el-radio-group v-model="data.expressFreight">
                    <!-- <el-radio :label="1">包邮</el-radio> -->
                    <div>
                      <el-radio :label="1">包邮</el-radio>
                    </div>
                    <!-- <div style="margin-top: 10px;">
                      <el-radio :label="2">运费模板</el-radio>
                      <FreightModelSelect v-model="data.freightModel"></FreightModelSelect>
                    </div> -->
                  </el-radio-group>
                </el-form-item>
                <el-form-item label-width="0px" style="text-align: center;">
                  <Cbutton size="medium" @click="handleStep(-1)">上一步</Cbutton>
                  <Cbutton size="medium" @click="handleStep(1)">下一步，填写其他信息</Cbutton>
                </el-form-item>
              </div>
            </el-row>
          </TabsPane>
          <TabsPane label="其他信息" :name="'4'">
            <el-row class="edit-form-item">
              <div class="form-content">
                <el-form-item label="限购次数：" prop="buyerLimit">
                  <el-input v-model="data.buyerLimit" placeholder="请输入限购次数"></el-input>
                  <span style="color:#c0c4cc"> &nbsp; 0不限购</span>
                </el-form-item>
                <el-form-item label="服务承诺：" prop="serviceIdList">
                  <el-checkbox-group v-model="data.serviceIdList">
                    <el-checkbox :label="item.id" v-for="item in serviceList" :key="item.id">
                      {{item.name}}
                      <el-tooltip class="item" effect="dark" :content="item.descrition" placement="top">
                        <i class="el-icon-question" style="color:rgb(96, 98, 102)"></i>
                      </el-tooltip>
                    </el-checkbox>
                  </el-checkbox-group>
                </el-form-item>
                <el-form-item label="商品描述：" prop="description">
                  <el-input :rows="4" type="textarea" v-model="data.description" placeholder="请输入商品描述" maxlength="200"
                            show-word-limit :autosize="{ minRows: 4, maxRows: 10 }">
                  </el-input>
                </el-form-item>
                <el-form-item label-width="0px">
                  <Cbutton size="medium" @click="handleStep(-1)">上一步</Cbutton>
                  <Cbutton @click="handleSubmit('editProductForm', 1)" :btnloading="btnLoading" size="medium">保存并上架</Cbutton>
                  <Cbutton type="" :btnloading="btnLoading" size="medium" @click="handleSubmit('editProductForm')">保存</Cbutton>
                </el-form-item>

              </div>
            </el-row>
          </TabsPane>
        </Tabs>

      </el-form>
    </div>

    <el-dialog :title="exampleDialog.title" :visible.sync="exampleDialog.show" width="540px">
      <img :src="exampleDialog.img" alt="" style="width: 500px;height:650px;">
    </el-dialog>
  </div>
</template>

<script>
import Upload from '@/components/Upload/edit'
import { GetProductInfo, GetProductGroupingList, GetProductClassifyList, GetServicePromiseList, EditProduct } from '@/api/onlineMan'
import { addProductFormRulse } from '@/utils/rules'
import BrandName from '@/components/Brand'
import Tabs from '@/components/CTab/tabs'
import TabsPane from '@/components/CTab/pane'
import Sku from './components/editSku'
// import FreightModelSelect from '@/components/Form/Select/freightModel'
import sellPointExamImg from '@/assets/images/sell-point-exam.png'
const sortReg = /^([1-9]\d*|[0]{1,1})$/ // 含零的正整数正则
const priceReg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/ // 含零的正整数正则 小数两位
export default {
  name: 'editProuduct',
  components: { Upload, BrandName, Tabs, TabsPane, Sku },
  data () {
    return {
      nameMaxLength: 100,
      loading: false,
      btnLoading: false,
      tabsActive: '1',
      data: {
        id: '',
        brandName: '',
        brandId: '',
        // 基本信息
        name: '',
        detailTitle: '',
        subTitle: '',
        sort: 0,
        productCategoryId: '', // 商品分类
        productCategoryIds: '', // 商品分类
        groupIds: [],
        pic: '', // 商品封面
        albumPics: '', // 轮播
        description: '', // 商品描述
        detailDesc: '', // 商品详情图

        // 商品规格与库存
        productStyle: '1', // 商品类型： 1->单规格 2->多规格 ,
        delStockStyle: '1', // 减库存方式: 1->付款减库存 ,
        recommandStatus: 0, // 推荐商品: 1->推荐 0->不推荐 ,
        showSales: 1, // 商品详情显示销量: 1->显示 0->不显示

        // 商品类型： 1->单规格 start
        priceType: '1', // 单规格 价格显示方式
        priceType2: '1', // 多规格 价格显示方
        price: '', // 商品价格
        usePointLimitSingle: '',
        priceSingle: '',
        linePrice: '', // 划线价格
        stock: '', // 库存
        usePointLimit: '0', // 积分兑换
        productSn: '', // 商品编码
        buyerLimit: '0', // 限购次数
        specificationsTypes: '',
        // 商品类型： 1->单规格 end

        // 物流及服务
        expressFreight: '1', //  快递运费: 1-> 包邮 ,
        freightModel: '', //  运费模板
        serviceIdList: [] // 服务承诺IDS
      },
      rules: addProductFormRulse,
      classList: [],
      groupList: [],
      serviceList: [],
      skuData: {},
      exampleDialog: {
        img: sellPointExamImg,
        show: false,
        title: '查看示例'
      },
      priceError: {
        usePointLimit: {
          reg: sortReg,
          message: '积分价格格式有误！',
          isError: false
        },
        usePointLimitSingle: {
          reg: sortReg,
          message: '积分价格格式有误！',
          isError: false
        },
        price: {
          reg: priceReg,
          message: '现金价格格式有误！',
          isError: false
        },
        priceSingle: {
          reg: priceReg,
          message: '现金价格格式有误！',
          isError: false
        }
      }
    }
  },
  props: {},
  watch: {},
  computed: {},
  created () {
    this.data.id = this.$route.query.id
    this.init()
  },
  mounted () { },
  methods: {
    handleStep (val) {
      if (val > 0) {
        // 检查价格
        if (this.tabsActive === '2' && this.data.productStyle === 1) {
          let errInfo = null
          for (const key in this.priceError) {
            if (this.priceError[key].isError) {
              errInfo = this.priceError[key]
              break
            }
          }
          if (errInfo) {
            this.$message.warning(errInfo.message)
            return
          }
        }
        if (this.tabsActive === '2' && this.data.productStyle === 2) {
          if (this.skuDataDetailPrice()) return
        }
        // 下一步
        // 数据校验
        const data = this.handleVerificationData(this.tabsActive)

        if (JSON.stringify(data) === '{}') {
          this.tabsActive = (Number(this.tabsActive) + 1).toString()
        } else {
          this.$message.warning(data.msg)
        }
      } else {
        this.tabsActive = (Number(this.tabsActive) - 1).toString()
      }
    },
    // 下一步 数据校验
    handleVerificationData (val) {
      const errorStr = '不得为空'
      const regObj = {
        // type 类型 null 都要校验 1 仅在单规格下校验 2 仅在多规格下校验
        '1': [
          { key: 'name', require: true, msg: '商品名称' + errorStr },
          { key: 'productCategoryIds', require: true, msg: '商品分类' + errorStr },
          { key: 'pic', require: true, msg: '商品封面图' + errorStr },
          { key: 'albumPics', require: true, msg: '商品轮播图' + errorStr },
          { key: 'detailDesc', require: true, msg: '商品详情图' + errorStr }
        ],
        '2': [
          { key: 'linePrice', require: true, msg: '划线价' + errorStr, type: 1 },
          { key: 'stock', require: true, msg: '商品库存' + errorStr, type: 1 },
          { key: 'productSn', require: true, msg: '商品编码' + errorStr }
        ],
        '3': [],
        '4': [
          { key: 'serviceIdList', require: true, msg: '服务承诺' + errorStr }
        ]
      }
      let data = {}
      const regList = regObj[val]

      for (let index = 0; index < regList.length; index++) {
        if (regList[index].type === 1 && this.data.productStyle === 1) {
          if (!this.data[regList[index].key]) {
            data = regList[index]
            break
          }
        } else if (!regList[index].type) {
          if (!this.data[regList[index].key]) {
            data = regList[index]
            break
          }
        }
      }
      return data
    },
    init () {
      // 拉取商品数据
      this.getProductInfo()
      // 拉取分类数据
      this.getClass()
      // 拉取分组数据
      this.getGroup()
      // 拉取服务承诺数据
      this.getService()
    },
    handleBack () {
      this.$router.go(-1)
    },
    getBrandName (val) {
      this.data.brandName = val
    },
    handleChangeProductType (val) {
      this.data.productStyle = val
    },
    handleSubmit (formName, type) {
      this.$refs[formName].validate((valid, val) => {
        if (!valid) {
          let errList = []
          for (const key in val) {
            errList = errList.concat(val[key])
          }
          const msg = errList[0].message
          this.$message.warning(msg)
        }
        if (!valid) return false
        // 保存上架

        const params = JSON.parse(JSON.stringify(this.data))
        params.productCategoryId = params.productCategoryIds[params.productCategoryIds.length - 1]
        if (type) {
          params.publishStatus = '1'
        } else {
          params.publishStatus = '0'
        }
        if (this.data.productStyle === '2' || this.data.productStyle === 2) {
          // 多规格
          if (this.skuDataDetailPrice()) return
          params.usePointLimit = '0'
          params.price = '0'
        } else {
          // 检查价格
          let errInfo = null
          for (const key in this.priceError) {
            if (this.priceError[key].isError) {
              errInfo = this.priceError[key]
              break
            }
          }
          if (errInfo) {
            this.$message.warning(errInfo.message)
            return
          }
          // 单规格
          if (this.data.priceType === '1') {
            // 积分+现金
            if (!this.data.price || !this.data.usePointLimit) {
              this.$message.warning('请填写积分、现金价格！')
              return
            }
            params.price = this.data.price
            params.usePointLimit = this.data.usePointLimit
          }
          if (this.data.priceType === '2') {
            // 积分
            if (!this.data.usePointLimitSingle) {
              this.$message.warning('请填写积分价格！')
              return
            }
            params.price = '0'
            params.usePointLimit = this.data.usePointLimitSingle
          }
          if (this.data.priceType === '3') {
            // 现金
            if (!this.data.priceSingle) {
              this.$message.warning('请填写现金价格！')
              return
            }
            params.usePointLimit = ''
            params.price = this.data.priceSingle
          }
        }
        this.btnLoading = true
        EditProduct(params).then(res => {
          this.btnLoading = false
          this.$message.success(res.message || '修改成功')
          this.$router.push({ name: 'pms:goods:list' })
        }).catch(() => {
          this.btnLoading = false
        })
      })
    },
    getProductInfo () {
      this.loading = true
      GetProductInfo(this.data.id).then(res => {
        this.loading = false
        const data = res.data
        for (const key in data) {
          if (this.data.hasOwnProperty(key) && data[key]) {
            this.data[key] = data[key]
          }
          if (this.data.hasOwnProperty(key) && data[key] === 0) {
            this.data[key] = data[key]
          }
        }
        if (this.data.pic && this.data.pic !== '') {
          this.data.picList = this.data.pic.split(',')
        }
        if (this.data.albumPics && this.data.albumPics !== '') {
          this.data.albumPicsList = this.data.albumPics.split(',')
        }
        if (this.data.detailDesc && this.data.detailDesc !== '') {
          this.data.detailDescList = this.data.detailDesc.split(',')
        }
        this.data.productCategoryIds = data.productCategoryIdList
        this.data.brandId = data.brandId.toString()

        if (data.productStyle === 2) {
          this.skuData = {
            pmsSkuStockVOList: data.stocks || [],
            attributeParamList: data.skus || []
          }
          let countPrice = 0
          let countUsePointLimit = 0
          let skuLen = this.skuData.pmsSkuStockVOList.length || 0
          this.skuData.pmsSkuStockVOList.forEach(e => {
            if (!e.price || e.price === '0' || e.price === 0) {
              countPrice++
            }
            if (!e.usePointLimit || e.usePointLimit === '0' || e.usePointLimit === 0) {
              countUsePointLimit++
            }
          })
          if (countPrice !== skuLen && countUsePointLimit !== skuLen) {
            // 价格不为零 积分不为零 显示积分+现金
            this.data.priceType2 = '1'
          }
          if (countPrice === skuLen && countUsePointLimit !== skuLen) {
            // 价格为零 显示积分
            this.data.priceType2 = '2'
          }
          if (countPrice !== skuLen && countUsePointLimit === skuLen) {
            // 价格不为零 积分为零 显示现金
            this.data.priceType2 = '3'
          }
        } else {
          if ((data.price !== '0' || data.price !== 0) && (data.usePointLimit !== '0' || data.usePointLimit !== 0)) {
            this.data.priceType = '1'
          }
          if ((data.price === '0' || data.price === 0) && (data.usePointLimit !== '0' || data.usePointLimit !== 0)) {
            this.data.priceType = '2'
            this.data.usePointLimitSingle = data.usePointLimit
            this.data.price = ''
            this.data.usePointLimit = ''
          }
          if ((data.price !== '0' || data.price !== 0) && (data.usePointLimit === '0' || data.usePointLimit === 0)) {
            this.data.priceType = '3'
            this.data.priceSingle = data.price
            this.data.price = ''
            this.data.usePointLimit = ''
          }
          this.skuData = {}
        }
      }).catch(() => {
        this.loading = false
      })
    },
    getClass () {
      const params = {
        pageNum: 1,
        pageSize: 30
      }
      GetProductClassifyList(params).then(res => {
        res.data.map(item => {
          if (item.children && item.children.length === 0) {
            delete item.children
          }
          if (item.children && item.children.length >= 1) {
            item.children.map(items => {
              if (items.children && items.children.length === 0) {
                delete items.children
              }
            })
          }
        })
        this.classList = res.data
      }).catch(() => { })
    },
    getGroup () {
      const params = {
        pageNum: 1,
        pageSize: 30
      }
      GetProductGroupingList(params).then(res => {
        res.data.list.map(item => {
          this.groupList.push({
            value: item.id,
            label: item.groupName
          })
        })
      }).catch(() => { })
    },
    getService () {
      const params = {
        relationType: 2,
        type: 22,
        pageNum: 1,
        pageSize: 30
      }
      GetServicePromiseList(params).then(res => {
        this.serviceList = res.data.list
      }).catch(() => { })
    },
    handleGetSkuData (data) {
      this.data.attributeParamList = data.attributeParamList
      this.data.pmsSkuStockVOList = data.pmsSkuStockVOList
    },
    priceTypeChange (val) {
      if (val === '1') {
        this.data.usePointLimitSingle = ''
        this.data.priceSingle = ''
      }
      if (val === '2') {
        this.data.price = ''
        this.data.usePointLimit = ''
        this.data.priceSingle = ''
      }
      if (val === '3') {
        this.data.price = ''
        this.data.usePointLimit = ''
        this.data.usePointLimitSingle = ''
      }
    },
    hanldeOpenExample () {
      this.exampleDialog.show = true
    },
    handlePriceReg (val, type) {
      if (!val) {
        for (const key in this.priceError) {
          this.priceError[key].isError = false
        }
      } else {
        const value = val
        const name = type
        if (!this.priceError[name].reg.test(value)) {
          this.priceError[name].isError = true
        } else {
          this.priceError[name].isError = false
        }
      }
    },
    // 规格明细中 价格检测
    skuDataDetailPrice () {
      let errInfo = null
      let count = 0
      this.data.attributeParamList.forEach(e => {
        if (!e.name) count++
        if (e.attributeValueList && e.attributeValueList.length > 0) {
          e.attributeValueList.forEach(i => {
            if (!i.value) count++
          })
        }
      })
      if (count > 0) {
        errInfo = '规格表中存在空值'
      }
      if (this.data.pmsSkuStockVOList.length <= 0) {
        errInfo = '规格明细不存在'
      }
      for (let index = 0; index < this.data.pmsSkuStockVOList.length; index++) {
        const e = this.data.pmsSkuStockVOList[index]
        if (!priceReg.test(e.price)) {
          errInfo = '规格明细中现金价格格式错误！'
          break
        }
        if (!sortReg.test(e.usePointLimit)) {
          errInfo = '规格明细中积分价格格式错误！'
          break
        }
        if (!sortReg.test(e.stock)) {
          errInfo = '规格明细中库存格式错误！'
          break
        }
      }
      if (errInfo) {
        this.$message.warning(errInfo)
        return true
      } else {
        return false
      }
    }

  }
}

</script>
<style lang='scss' scoped>
$editProuductBorder: 1px solid rgb(232, 232, 232);
.product-edit {
  max-width: 1200px;
  overflow: hidden;
  margin: 10px 0 0 50px;
  .edit-form-item {
    border: $editProuductBorder;
    box-sizing: border-box;
    margin-bottom: 20px;
    border-top: none;
    position: relative;
    top: -20px;
  }
  .form-content {
    padding: 22px 20px 0;
  }
  h3 {
    font-size: 24px;
    font-weight: bold;
    padding: 10px;
    height: 36px;
    line-height: 36px;
    border-bottom: $editProuductBorder;
  }
  .el-date-editor.el-input,
  .el-select,
  .el-input,
  .el-input-number,
  .el-cascader {
    width: 240px;
  }
  .el-textarea {
    width: 400px;
  }
  .single-sku {
    border: 1px solid rgba(232, 232, 232, 1);
    margin: 0px 0 10px 100px;
    padding: 20px 0 0;
    box-sizing: border-box;
  }
}
</style>
